  <!--
  @create by 
  @update by 
  @description 
-->
<div>
  <el-form-q :field-data="queryFields" :buttons="queryButtons"></el-form-q>
  <div class="yu-toolBar">
    <el-button-group>
     <el-button icon="plus" @click="addFn" v-if="checkPermission('create')">新增</el-button>
     <el-button icon="edit" @click="commitFn" v-if="checkPermission('commit')">提交</el-button>
     <el-button icon="document" @click="infoFn" v-if="checkPermission('detail')">查看</el-button>
     <el-button icon="yx-bin" @click="deleteFn" v-if="checkPermission('delete')">删除</el-button>
    </el-button-group>
    <div style="display: inline-block;vertical-align: middle;padding-top: 12px;">
      <el-tag type="danger">提示：业务移交需日终跑批后才更新</el-tag>
    </div>
    
  </div>
  <el-table-x ref="reftable" :row-index="true" :radiobox="false" :base-params="baseParams"
        :data-url="appDataUrl"  :table-columns="tableColumns" :request-type="'POST'" ></el-table-x>   
 
  <el-dialog title="客户移交申请" :visible.sync="dialogVisible" size="full" >

      <el-form-x ref="reform" :group-fields="appUpdateFields" label-width="180px" ></el-form-x>
      <div class="yu-toolBar">
        <el-button-group>
          <el-button icon="plus" @click="addDedailFn">添加移交明细</el-button>  
          <el-button icon="yx-bin" @click="deleteAppFn">删除</el-button>
        </el-button-group>
      </div>
      <yufp-pageable-table ref="appReftable" :row-index="true" :checkbox="true"
        :table-columns="appTableColumns" :total-data="detailTotalData">
      </yufp-pageable-table>
      <div slot="footer" class="dialog-footer">
          <el-button icon="check" type="primary" @click="saveCusHandoverApply" :loading="saveApplyLoading">保存</el-button>
          <el-button icon="yx-undo2" @click="dialogVisible = false">返回</el-button>
      </div>

  </el-dialog>
  <!-- 点击查看按钮的弹出框 -->
  <el-dialog title="客户移交" :visible.sync="appDetaildialogVisible"  size="full" >
    <el-form-x ref="appDetailReform"  :group-fields="appDetailUpdateFields"  label-width="120px" :disabled="true"> </el-form-x>
    <el-table-x ref="appReftableinfo" :pageable="true" :data-url="applyDetailDataUrl" 
      :default-load="false" :table-columns="appTableColumns" request-type="POST">
    </el-table-x>
    <div slot="footer" class="dialog-footer">
      <el-button icon="yx-undo2" @click="appDetaildialogVisible = false">返回</el-button>
    </div>
  </el-dialog>
  <!-- 按客户 -->
  <el-dialog title="移交明细" :visible.sync="cusDialogVisible"  size="large" >
    <el-form-q :field-data="cusQueryFields" :buttons="cusQueryButtons"></el-form-q>
  
    <el-table-x ref="cusReftable" :row-index="true" :checkbox ="true" 
        :data-url="appCustDataUrl" :table-columns="cusQableColumns" :request-type="'POST'">
    </el-table-x>
    <div slot="footer" class="dialog-footer">
      <el-button icon="check" type="primary" @click="addCusOrAreaCus">确定</el-button>
      <el-button icon="yx-undo2" @click="cusDialogVisible = false">取消</el-button>
    </div>
  </el-dialog>

  <el-dialog title="移交明细" :visible.sync="histDialogVisible"  size="large" ><!-- 按移交历史 -->
    <el-form-x ref="histReform" :group-fields="histUpdateFields"  :buttons="histQueryButtons" ></el-form-x>
    <el-table-x ref="histReftable" :row-index="true" :checkbox ="true" :base-params="histBaseParams" 
        :data-url="appHistDataUrl"    :table-columns="histQableColumns" :request-type="'POST'">
    </el-table-x>
    <el-form-x  :buttons="histUpdateButtons"  ></el-form-x>
  </el-dialog>
</div>
